<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>svg</title>
  </head>
  <body>
    <svg width="1200" height="400">
      <!-- 线 -->
      <line x1="100" y1="100" x2="200" y2="200" stroke="#000" />
      <line x1="200" y1="200" x2="300" y2="100" style="stroke: #000" />
      <!-- 折线 -->
      <polyline
        points="
          400 100,
          500 200,
          400 200
        "
        stroke="#000"
        fill-opacity="0"
      />
      <!-- 矩形 -->
      <rect
        x="600"
        y="100"
        width="200"
        height="100"
        stroke="#000"
        fill-opacity="0"
      />
      <!-- 圆 -->
      <circle cx="900" cy="200" r="50" stroke="#000" fill-opacity="0" />
      <!-- 椭圆 -->
      <ellipse
        cx="900"
        cy="200"
        rx="100"
        ry="50"
        stroke="#000"
        fill-opacity="0"
      />
      <!-- 多边形 -->
      <polygon
        points="
          400 300,
          500 350,
          600 300
        "
        stroke="#000"
        fill-opacity="0"
      />
      <!-- 任意图形 -->
      <path
        d="
          M 1000 200,
          L 1200 200,
          L 1050 320,
          L 1100 130,
          L 1150 320,
          Z
        "
        stroke="#000"
        fill-opacity="0"
      />
    </svg>

    <svg viewBox="0 0 1024 1024" width="16" height="16">
      <path d="M0 0h1024v1024H0z" fill="#FFFFFF"></path>
      <path
        d="M288 96a192 192 0 1 0 0 384H448a32 32 0 0 0 32-32v-160a192 192 0 0 0-192-192zM448 544h-160a192 192 0 1 0 192 192V576a32 32 0 0 0-32-32zM736 96a192 192 0 0 0-192 192V448a32 32 0 0 0 32 32h160a192 192 0 0 0 0-384z"
        fill="#111111"
      ></path>
      <path
        d="M736 544H576a32 32 0 0 0-32 32v160a192 192 0 1 0 192-192z"
        fill="#000000"
      ></path>
    </svg>

    <svg
      t="1666678831760"
      class="icon"
      viewBox="0 0 1024 1024"
      version="1.1"
      xmlns="http://www.w3.org/2000/svg"
      p-id="1501"
      width="20"
      height="20"
    >
      <path d="M0 0h1024v1024H0z" fill="#FFFFFF" p-id="1502"></path>
      <path
        d="M725.333333 117.333333a32 32 0 0 1 27.157334 15.082667l1.472 2.624 81.706666 163.605333L928 298.666667v64l-60.352-0.021334 56.810667 113.706667a32 32 0 0 1 3.221333 11.328l0.149333 2.986667 0.170667 298.666666v85.333334a32 32 0 0 1-28.928 31.850666L896 906.666667h-170.666667a32 32 0 0 1-31.850666-28.928L693.333333 874.666667l-0.021333-53.333334h-362.666667L330.666667 874.666667a32 32 0 0 1-25.92 31.424l-2.986667 0.426666L298.666667 906.666667H128a32 32 0 0 1-31.850667-28.928L96 874.666667V490.666667c0-3.968 0.746667-7.893333 2.176-11.584l1.194667-2.730667L156.224 362.666667 96 362.666667v-64l92.224-0.021334 81.813333-163.626666a32 32 0 0 1 25.621334-17.536L298.666667 117.333333h426.666666z m-64 469.333334H362.666667v64h298.666666v-64z"
        fill="#111111"
        p-id="1503"
      ></path>
    </svg>
  </body>
</html>
